<script setup lang="ts">
import { reactive } from "vue";
// import { Index } from "@yll10243/vue-form-render";
import { Index } from "../../packages/vue-form-render/src/index";
const state = reactive({
  schema: {
    type: "object",
    title: "看下",
    properties: {
      AllString: {
        title: "string类",
        type: "AyiBoolean",
        default: "1@qq.com",
        validatorObj: {
          name: "isEmail1",
          options: "",
          other: "1@qq.com",
          msg: "提示信息",
        },
        "ui:hidden": (val: any, rootValue: object) => {
          // console.log("我是个方法", val, rootValue);
        },
      },
      // AllString2: {
      //   title: "string类",
      //   type: "AyiBoolean",
      //   default: "1@qq.com",
      //   validatorObj: {
      //     name: "isEmail1",
      //     options: "",
      //     other: "1@qq.com",
      //     msg: "提示信息",
      //   },
      //   "ui:hidden": "{{rootValue.AllString !== 'goal'}}",
      // },
    },
    required: ["AllString"],
  },
  formData: {
    content: "<a>超链接</a>",
  },
});
// const state = reactive({
//   schema: {
//     type: "object",
//     properties: {
//       AllString: {
//         title: "string类",
//         type: "object",
//         properties: {
//           input: {
//             title: "简单输入框",
//             type: "string",
//             "ui:options": {
//               placeholder: "昵称",
//             },
//           },
//           textarea: {
//             title: "再次子",
//             type: "object",
//             properties: {
//               input: {
//                 title: "子input",
//                 type: "string",
//                 default: 1,
//               },
//             },
//           },
//           color: {
//             title: "颜色选择",
//             type: "string",
//             format: "color",
//           },
//           date: {
//             title: "日期选择",
//             type: "string",
//             format: "date",
//           },
//           image: {
//             title: "图片展示",
//             type: "string",
//             format: "image",
//           },
//         },
//       },
//       allNumber: {
//         title: "number类",
//         type: "object",
//         properties: {
//           number1: {
//             title: "数字输入框",
//             description: "1 - 1000",
//             type: "number",
//             min: 1,
//             max: 1000,
//           },
//           number2: {
//             title: "带滑动条",
//             type: "number",
//             "ui:widget": "slider",
//           },
//         },
//       },
//       allBoolean: {
//         title: "boolean类",
//         type: "object",
//         properties: {
//           radio: {
//             title: "是否通过",
//             type: "boolean",
//           },
//           switch: {
//             title: "开关控制",
//             type: "boolean",
//             "ui:widget": "switch",
//           },
//         },
//       },
//       allRange: {
//         title: "range类",
//         type: "object",
//         properties: {
//           dateRange: {
//             title: "日期范围",
//             type: "range",
//             format: "dateTime",
//             "ui:options": {
//               placeholder: ["开始时间", "结束时间"],
//             },
//           },
//         },
//       },
//       allEnum: {
//         title: "选择类",
//         type: "object",
//         properties: {
//           select: {
//             title: "单选",
//             type: "string",
//             enum: ["a", "b", "c"],
//             enumNames: ["早", "中", "晚"],
//           },
//           radio: {
//             title: "单选",
//             type: "string",
//             enum: ["a", "b", "c"],
//             enumNames: ["早", "中", "晚"],
//             "ui:widget": "radio",
//           },
//           multiSelect: {
//             title: "多选",
//             description: "下拉多选",
//             type: "array",
//             items: {
//               type: "string",
//             },
//             enum: ["A", "B", "C", "D"],
//             enumNames: ["杭州", "武汉", "湖州", "贵阳"],
//             "ui:widget": "multiSelect",
//           },
//           boxes: {
//             title: "多选",
//             description: "checkbox",
//             type: "array",
//             items: {
//               type: "string",
//             },
//             enum: ["A", "B", "C", "D"],
//             enumNames: ["杭州", "武汉", "湖州", "贵阳"],
//           },
//         },
//       },
//       obj1: {
//         title: "可折叠对象",
//         description: "这是个对象类型",
//         type: "object",
//         "ui:options": {
//           collapsed: true,
//         },
//         properties: {
//           input1: {
//             title: "输入框1",
//             type: "string",
//           },
//           input2: {
//             title: "输入框2",
//             type: "string",
//           },
//         },
//       },
//       listName2: {
//         title: "对象数组",
//         description: "对象数组嵌套功能",
//         type: "array",
//         minItems: 1,
//         maxItems: 3,
//         "ui:displayType": "row",
//         items: {
//           type: "object",
//           properties: {
//             input1: {
//               title: "简单输入框",
//               type: "string",
//               "ui:hidden": "{{rootValue.selet1 !== 'b'}}",
//             },
//             selet1: {
//               title: "单选",
//               type: "string",
//               enum: ["a", "b", "c"],
//               enumNames: ["早", "中", "晚"],
//             },
//           },
//         },
//       },
//     },
//     required: [],
//   },
//   formData: {},
// });
</script>

<template>
  <div>
    <Index :schema="state.schema" :formData="state.formData"></Index>
  </div>
</template>

<style scoped></style>
